<template>
  <div class="app-container">
    <h1>App 根组件</h1>
    
    <router-link to="/home">首页</router-link>
    <router-link to="/movie/1">洛基</router-link>
    <router-link to="/movie/2?name=zs&age=20">雷神</router-link>
    <router-link to="/movie/3">复联</router-link>
    <router-link to="/about">关于</router-link>
    <hr/>

    <div class="box">
      <!--  只要在项目中安装和配置了 vue-router， 就可以使用router-view这个组件了 它的作用很简单： 占位符 -->
      <router-view></router-view>
     
    </div>
  </div>
</template>

<script>


export default {

}
</script>

<style lang="less">
.app-container {
  padding: 1px 20px 20px;
  background-color: #efefef;

  > a {
    margin-right: 10px;
  }
}
.box {
  display: flex;
}
</style>
